<template>

  <el-dialog title="设置通道结算金额" width="30%" :visible.sync="dialogVisible" :close-on-click-modal="false">

    <el-form ref="main-form" :model="form" :rules="rules" label-width="120px">
      <el-form-item label="结算金额" size="mini" prop="settleAmount">
        <el-input placeholder="" v-model="form.settleAmount" @keyup.enter.native="submit" clearable></el-input>
      </el-form-item>
    </el-form>

    <div slot="footer" class="dialog-footer">
      <el-button @click="close" size="small">取 消</el-button>
      <el-button type="primary" @click="submit" size="small" :loading="loading">提 交</el-button>
    </div>

  </el-dialog>
</template>

<script>

import ApiMain from '@/api/statMonthlyTrade';

export default {
  mixins: [
  ],
  props: [
  ],
  data () {
    return {

      dialogVisible: false,
      popDeleteVisible: false,
      loading: false,

      form: {
        settleAmount: '',
      },

      rules: {
        settleAmount: [
          { required: true, message: '请输入结算金额', trigger: 'blur' },
          { pattern: /^(([1-9]{1}\d*)|(0{1}))(\.\d{1,2})?$/, message: '最多两位小数', trigger: 'change' }
        ],
      },

      id  : null,
      data: null,

    }
  },
  mounted () {
  },

  methods: {

    show (id = null, settleAmount = '') {

      this.id = id;
      this.form.settleAmount = settleAmount / 100;
      this.dialogVisible = true;
    },

    close () {
      this.dialogVisible = false;
      this.$emit('dialog-close');
    },

    reset () {
      this.form = {
        settleAmount: '',
      };
    },

    handleDateRangeChange () {
      this.form.startTime = this.dateRange.length > 0 ? this.dateRange[0] : ''
      this.form.endTime = this.dateRange.length > 0 ? this.dateRange[1] : ''
    },

    verifyForm () {
      var bool = true;
      this.$refs['main-form'].validate((valid) => bool = valid);
      return bool;
    },

    async submit () {

      if (! this.verifyForm()) return false;

      this.loading = true;

      try {
        await this.submitSetSettleAmount();
      } finally {
        this.loading = false;
      }
    },

    async submitSetSettleAmount () {

      this.form.id = this.id;
      let form = Object.copy(this.form);
      form.settleAmount *= 100;
      await ApiMain.setSettleAmount(form);
      this.$message({message: '设置成功', type: 'success'});
      this.close();

    },

  }
}
</script>

<style>
.ql-editor{
  height: 400px;
}
</style>
